<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <script>
        function createFrom(){
            var from = document.getElementById("register");
            //账号
            var divElement = document.createElement("div");
            var labelElement = document.createElement("label");
            labelElement.innerText = "姓名：";
            divElement.appendChild(labelElement);
            var inputElement = document.createElement("input");
            inputElement.type = "text";
            inputElement.name = "username";
            inputElement.placeholder = "请输入姓名";
            divElement.appendChild(inputElement);
            from.appendChild(divElement);

            //密码
            divElement = document.createElement("div");
            labelElement = document.createElement("label");
            labelElement.innerText = "密码：";
            divElement.appendChild(labelElement);
            inputElement = document.createElement("input");
            inputElement.type = "password";
            inputElement.name = "password";
            inputElement.placeholder = "请输入密码";
            divElement.appendChild(inputElement);
            from.appendChild(divElement);
            //性别
            divElement = document.createElement("div");
            labelElement = document.createElement("label");
            labelElement.innerText = "性别：";
            divElement.appendChild(labelElement);
            inputElement = document.createElement("input");
            inputElement.type = "radio";
            inputElement.name = "gender";
            inputElement.value = "nan";
            divElement.appendChild(inputElement);
            labelElement = document.createElement("label");
            labelElement.innerText = "男 ";
            divElement.appendChild(labelElement);
            inputElement = document.createElement("input");
            inputElement.type = "radio";
            inputElement.name = "gender";
            inputElement.value = "nv";
            divElement.appendChild(inputElement);
            labelElement = document.createElement("label");
            labelElement.innerText = "女 ";
            divElement.appendChild(labelElement);
            from.appendChild(divElement);
            //爱好
            divElement = document.createElement("div");
            labelElement = document.createElement("label");
            labelElement.innerText = "爱好：";
            divElement.appendChild(labelElement);
            inputElement = document.createElement("input");
            inputElement.type = "checkbox";
            inputElement.name = "hobby";
            inputElement.value = "cg";
            divElement.appendChild(inputElement);
            labelElement = document.createElement("label");
            labelElement.innerText = "唱歌 ";
            divElement.appendChild(labelElement);
            inputElement = document.createElement("input");
            inputElement.type = "checkbox";
            inputElement.name = "hobby";
            inputElement.value = "tw";
            divElement.appendChild(inputElement);
            labelElement = document.createElement("label");
            labelElement.innerText = "跳舞 ";
            divElement.appendChild(labelElement);
            from.appendChild(divElement);
            //籍贯
            divElement = document.createElement("div");
            labelElement = document.createElement("label");
            labelElement.innerText = "爱好：";
            divElement.appendChild(labelElement);
            var selectElement = document.createElement("select");
            selectElement.name = "jg";
            divElement.appendChild(selectElement);
            var optionElement = document.createElement("option");
            optionElement.value = "hn";
            optionElement.innerHTML = "湖南";
            selectElement.appendChild(optionElement);
            optionElement = document.createElement("option");
            optionElement.value = "hb";
            optionElement.innerHTML = "湖北";
            selectElement.appendChild(optionElement);
            optionElement = document.createElement("option");
            optionElement.value = "gd";
            optionElement.innerHTML = "广东";
            selectElement.appendChild(optionElement);
            from.appendChild(divElement);
            //按钮
            divElement = document.createElement("div");
            inputElement = document.createElement("input");
            inputElement.type = "submit";
            inputElement.value = "提交";
            divElement.appendChild(inputElement);
            inputElement = document.createElement("input");
            inputElement.type = "reset";
            inputElement.value = "清空";
            divElement.appendChild(inputElement);
            from.appendChild(divElement);

        }
    </script>
</head>
<body>
    <button onclick="createFrom()">生成表单</button>
    <hr/>
    <form id="register">

    </form>
</body>
</html>